import React, { Component } from 'react';
import PropTypes from 'prop-types'
class XiaojiejieItem   extends Component {
    state = {  }
    constructor(props){
        super(props)
        this.handclick=this.handclick.bind(this)
    }
    render() { 
        return ( 
            // 父组件给这个子组件传值显示数据 this.props.。子组件点击删除传给父组件

            <li onClick={this.handclick}>小姐姐{this.props.content}</li>
         );
    }
    // 怎么给子组件传值
    handclick(){
          console.log(this.props.index)
        //   子组件操作父组件的数据，但是子组件不能直接改变父组件数据会报错 是单向数据流，需要子组件去调用父组件的方法去改变父组件的值
        // this.props.list=[]
        // this.props.index=0
        this.props.deleteItem(this.props.index)
        

    }
}
XiaojiejieItem.propTypes={
    // 要求传递字符串，而我们父组件传的值却传递了数字过来，所以给了警告。
    content:PropTypes.string,
    deleteItem:PropTypes.func,
    index:PropTypes.number,
    // 必须进行传递，如果不传递会提醒报错提示。
    avname:PropTypes.string.isRequired,
  
}
//defaultProps
XiaojiejieItem.defaultProps = {
    avname:'松岛枫'
}
 
export default XiaojiejieItem;